<template>
	<view>
		<!-- 个人发票 -->
		<view v-if="invoiceInfo.invoiceTitleType == 2" class="invoiceBox">
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">发票类型:</text>
				<text>{{invoiceInfo.invoiceType|invoiceType}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">抬头类型:</text>
				<text>{{invoiceInfo.invoiceTitleType|invoiceTitleType}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">抬头名称:</text>
				<text>{{invoiceInfo.invoiceTitle}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">发票金额:</text>
				<text style="color: red;">{{invoiceInfo.invoiceAmount}}元</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">申请时间:</text>
				<text>{{invoiceInfo.applyTime}}</text>
			</view>
		</view>
		
		
		<view v-else class="invoiceBox">
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">发票类型:</text>
				<text>{{invoiceInfo.invoiceType|invoiceType}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">抬头类型:</text>
				<text>{{invoiceInfo.invoiceTitleType|invoiceTitleType}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">公司名称:</text>
				<text>{{invoiceInfo.invoiceTitle}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">公司税号:</text>
				<text>{{invoiceInfo.dutyParagraph|filterNull}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">注册地址:</text>
				<text>{{invoiceInfo.registeredAddress|filterNull}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">注册电话:</text>
				<text>{{invoiceInfo.registeredTelephone|filterNull}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">开户银行:</text>
				<text>{{invoiceInfo.bank|filterNull}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">银行账号:</text>
				<text>{{invoiceInfo.bankAccount|filterNull}}</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">发票金额:</text>
				<text style="color: red;">{{invoiceInfo.invoiceAmount}}元</text>
			</view>
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">申请时间:</text>
				<text>{{invoiceInfo.applyTime}}</text>
			</view>
		</view>
		
		
		<view class="invoiceBox">
			{{invoiceInfo.bizNoStr}}
		</view>
		
		<view class="invoiceBox">
			<view class="invoiceItem">
				<text style="color: #666;margin-right: 10rpx;">开票方式:</text>
				<text>{{invoiceInfo.invoiceWay|invoiceWay}}</text>
			</view>
			
			<view v-if="invoiceInfo.invoiceWay == 1">
				<view class="invoiceItem">
					<text style="color: #666;margin-right: 10rpx;">电子邮箱:</text>
					<text>{{invoiceInfo.email}}</text>
				</view>
			</view>
			
			<view v-else>
				<view class="invoiceItem">
					<text style="color: #666;margin-right: 10rpx;">收件人:</text>
					<text>{{invoiceInfo.consignee}}</text>
				</view>
				<view class="invoiceItem">
					<text style="color: #666;margin-right: 10rpx;">收件地址:</text>
					<text>{{invoiceInfo.consigneeAddress}}</text>
				</view>
				<view class="invoiceItem">
					<text style="color: #666;margin-right: 10rpx;">联系电话:</text>
					<text>{{invoiceInfo.contactPhone}}</text>
				</view>
			</view>
			
			
			
		</view>
		
	</view>
</template>

<script>
	import {
		apiInvoiceInfo
	} from '@/api/invoice-api.js'
	export default {
		data() {
			return {
				invoiceId: '',
				invoiceInfo: {}
			}
		},
		onLoad(op) {
			this.invoiceId = op.invoiceId;
			this.getInvoiceInfo();
		},
		methods: {
			getInvoiceInfo() {
				apiInvoiceInfo(this.invoiceId).then(res => {
					this.invoiceInfo = res.data;
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.invoiceBox {
		margin: 20rpx;
		background-color: #fff;
		border-radius: 16rpx;
		padding: 20rpx;
		font-size: 28rpx;
		color: #333;
		.invoiceItem {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 10rpx;
		}
	}

	
</style>
